import { defineStore } from 'pinia'
import Cookies from 'js-cookie'

interface IAppState {
  sidebar: {
    opened: boolean;
    withoutAnimation: boolean;
  };
  device: 'desktop' | 'mobile';
  size: string;
}

export const useAppStore = defineStore('app', {
  state: (): IAppState => ({
    sidebar: {
      opened: true,
      withoutAnimation: false
    },
    device: 'desktop',
    size: Cookies.get('size') || 'default'
  }),
  
  getters: {
    sidebar: (state) => state.sidebar,
    device: (state) => state.device
  },
  
  actions: {
    toggleSideBar(withoutAnimation: boolean) {
      this.sidebar.opened = !this.sidebar.opened
      this.sidebar.withoutAnimation = withoutAnimation
    },
    closeSideBar(withoutAnimation: boolean) {
      this.sidebar.opened = false
      this.sidebar.withoutAnimation = withoutAnimation
    },
    toggleDevice(device: string) {
      this.device = device as 'desktop' | 'mobile'
    },
    setSize(size: string) {
      this.size = size
      Cookies.set('size', size)
    }
  }
})